<template lang="jade">
div
  //- List
  h-loader-full(url='loader',:setdata='false')
    h-data-lister(data='list')
    m-title(icon='add',name='培训轮播图')
      select(v-model='p.sid',@click='link')
        option(value='', selected) 请选择（学校/机构）
        option(v-for='(n,i) in school', :value='n.id') {{n.name}}
      select(v-model='p.culid')
        option(value='', selected) 请选择课程
        option(v-for='(n,i) in cultivate', :value='n.id') {{n.name}}
      button(@click='filter(p)') 过滤
    table.list
      ml-header(data='ID, 图片,所属学校, 所属课程, 操作')
      tr(v-for='(v, i) in list')
        td {{ v.id }}
        td: img(:src="'http://xiongan.tset.hesq.com.cn/image/' + v.url",style='width:100px;')
        td {{v.sname}}
        td {{v.culname}}
        td
          a(href='javascript:void(0)',class='remove',:data-index='i') 删除
    .command
      .page
        button(v-show='page>1', @click="pagego('last')") 上一页
        button {{page}}
        button(@click="pagego('next')") 下一页
        
    m-title(icon='add',name='轮播图添加')
    table.single
      mf-row(name='请选择学校/机构')
        select(v-model='img.sid',@click='link')
          option(value='', selected) 请选择（学校/机构）
          option(v-for='(n,i) in school', :value='n.id') {{n.name}}
      mf-row(name='请选择课程')
        select(v-model='img.culid')
          option(value='', selected) 请选择课程
          option(v-for='(n,i) in cultivate', :value='n.id') {{n.name}}
      mf-row(name='轮播图片')
        mf-upload(uploadid='img',amount='1',rule='cultivate', :data='img.url',@upload_data='text',style='marginTop:20px')
        p(style='marginBottom:0px') 轮播图图片尺寸 750px（宽）*300px（高）
      mf-row
        button(@click='button') 添加
</template>
<script>
export default {
	data () {
		return {
      loader:{
        school:'cultivate/school/list',
        list:'cultivate/swiper/list'
      },
      school : [],
      cultivate: [],
      list:[],
      p:{
        sid:'',
        culid:''
      },
      page:1,
      url:{
        remove:'cultivate/delete/swiper'
      },
      img:{
        url:[],
        sid:'',
        culid:''
      },
		}
	},
	methods: {
    text(data){
			this.img.url = data
		},
    loadAfter(res){
			this.school = res.school[0]
      this.list = res.list
		},
    link(){
      this.$ajax.get('cultivate/cultivate/list?sid=' + this.img.sid, (res) => {
				this.cultivate = res.data[0]
        this.cultivate.unshift({id:0,name:'添加学校图片'})
				this.page = 1
			}, (res) => {
				this.error(res.message)
			})
    },
    filter(p){
			this.$ajax.get('cultivate/swiper/list?culid=' + this.p.culid + '&sid=' + this.p.sid, (res) => {
				this.list = res.data
				this.page = 1
			}, (res) => {
				this.error(res.message)
			})
		},
    pagego (type) {
      this.page = type == 'last' ? this.page - 1 : this.page + 1
      this.$ajax.get('cultivate/swiper/list?culid=' + this.p.culid + '&sid=' + this.p.sid + '&page=' + this.page, (res) => {
        this.list = res.data
      }, (res) => {
        this.error(res.message)
      })
    },
    button(){
      
      if(this.img.sid == ''){
        this.$msg.error('请选择图片所属学校！')
        return
      }
      if(this.img.culid === ''){
        this.$msg.error('请选择图片所属课程！')
        return
      }
      if(this.img.url.length == 0){
        this.$msg.error('请上传图片！')
        return
      }
      this.$ajax.post('cultivate/add/swiper',this.img,(res)=>{
        this.$msg.success(res.message)
        setTimeout("window.location.reload()",1500)
      },(res)=>{
        this.$msg.error(res.message)
      })
    }
	}
}
</script>
<style lang="less" scoped>
@import "../../../plugin/style/mixin";
	input[type='text']{ .w(90%);}
  .page{ float:right; }
		.page a{background: #4db3ff; color: #fff; padding:3px 10px; border-radius:4px; cursor:pointer;}
		.page b{margin:0 10px;}
</style>